<template>
  <div>
    <ul>
        <van-swipe :autoplay="3000">
        <van-swipe-item v-for="(image, index) in images" :key="index">
            <img v-lazy="image.img" />
        </van-swipe-item>
        </van-swipe>
    </ul>
  </div>
</template>

<script>
import Vue from 'vue';
import { Lazyload } from 'vant';

Vue.use(Lazyload);
import service from '@/utils/service';
export default {
    data(){
        return {
            images:[]
        }
    },
    mounted(){
        service({
        url:"http://localhost:3000/banner",
        method:"get",
        }).then((res)=>{
        // console.log(res.data)
        this.images = res.data
        })
    }
}
</script>

<style scoped>
ul {
    height: 220px;
    overflow: hidden;
    width: 96%;
    margin: auto;
    border-radius: 12px;
    margin-top: 5px;
    margin-bottom: 5px;
}
ul img {
    width: 100%;
}
</style>